<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head th:fragment="header-bootstrap4(title,active,open)">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--  防止微信图片不显示  -->
    <meta name="referrer" content="never">
    <meta data-draft-node="block" data-draft-type="table" data-size="normal" data-row-style="normal">
    <!--   <title>AdminLTE 3 | DataTables</title> -->
    <link rel="shortcut icon" th:href="@{/images/logo.png}" />
    <!-- Google Font: Source Sans Pro -->
    <link rel="stylesheet"
        href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="/plugins/fontawesome-free/css/all.min.css">
    <!-- DataTables -->
    <link rel="stylesheet" href="/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
    <link rel="stylesheet" href="/plugins/datatables-responsive/css/responsive.bootstrap4.min.css">
    <link rel="stylesheet" href="/plugins/datatables-buttons/css/buttons.bootstrap4.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/select/1.3.1/css/select.dataTables.min.css" />
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    <!--        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">-->
    <!-- Theme style -->
    <!--        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-treeview/1.2.0/bootstrap-treeview.min.css"/>-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/layui/2.8.2/css/layui.min.css"
        integrity="sha512-KVjplaL+JKK+75Hteuh7SvyGD7ndMdriU8eAQCpjwYBS90hjlM/EIlEWrqOL710BJe9VHKhTSbMJeBZY+w0lZA=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
    <link rel="stylesheet" href="/plugins/toastr/toastr.min.css">
    <!--        <link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">-->
    <link rel="stylesheet" href="/dist/css/adminlte.min.css">
    <link href="/css/city-picker.css" rel="stylesheet" type="text/css" />
    <link href="//cdn.staticfile.org/layui/2.9.1/css/layui.css" rel="stylesheet">
    <!--        <script src="/layui/layui.js"></script>-->
    <!--        <link href="/layui/css/layui.css" rel="stylesheet">-->

</head>
<div th:fragment="header-body-bootstrap4">
    <title>
        <th:block th:text="${title!=null?title:'后台管理'}+'- 任你游'"></th:block>
    </title>
    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
            </li>

        </ul>

        <!-- Right navbar links -->
        <ul class="navbar-nav ml-auto">
            <!-- Navbar Search -->
            <li class="dropdown">
                <a th:href="@{index.html}" class="dropdown-toggle profile" data-toggle="dropdown" aria-expanded="true">
                    <span class="username" th:text="${session.admin.username} + ${session.admin.remarks}"></span><span
                        class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a data-toggle="modal" data-target="#adminModal" class="text-blue" style="margin-left: 10px"><i
                                class="nav-icon fas ion-gear-a"></i> 管理账号</a></li>
                    <li><a th:href="@{/admin/logout}" style="margin-left: 10px"><i class="nav-icon fas fa-lock"></i>
                            注销</a></li>
                </ul>
            </li>
        </ul>
    </nav>
    <div class="modal fade" id="adminModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">编辑</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="col-md-12 column">
                        <form role="form" id="adminForm">
                            <input type="hidden" th:value="${session.adminId}" name="id" placeholder=""
                                class="form-control targetId" />
                            <div class="row">
                                <div class="form-group col-md-12">
                                    <label>账号</label>
                                    <input type="text" value="" name="username" placeholder=""
                                        class="form-control targetName" />
                                </div>
                                <div class="form-group col-md-12">
                                    <label>密码</label>
                                    <input type="password" value="" name="password" placeholder=""
                                        class="form-control targetName" />
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="modal-footer justify-content-between">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="editAdmin()">保存</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.navbar -->
    <!-- Main Sidebar Container -->
    <aside class="main-sidebar sidebar-dark-primary elevation-4">
        <!-- Brand Logo -->
        <a th:href="@{/admin/page/home}" class="brand-link">
            <img src="/images/kyrie.png" alt="AdminLTE Logo" class="brand-image  elevation-3" style="opacity: .8">
            <span class="brand-text font-weight-light">任你游泡泡机</span>
        </a>

        <!-- Sidebar -->
        <div class="sidebar">

            <!-- Sidebar Menu -->
            <nav class="mt-2">
                <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
                    data-accordion="false">
                    <li class="nav-item menu-open">

                        <ul class="nav nav-treeview">
                            <li class="nav-item">
                                <a th:href="@{/admin/page/home}"
                                    th:class="${active}=='home'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>首页</p>
                                </a>
                            </li>

                        </ul>
                    </li>
                    <li th:class="${open}=='dev'?'nav-item menu-open':'nav-item'">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fas ion-gear-a"></i>
                            <p>
                                设备管理
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">


                            <li class="nav-item">
                                <a th:href="@{/admin/page/dev}"
                                    th:class="${active}=='dev'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>设备列表</p>
                                </a>
                            </li>

                        </ul>
                    </li>
                    <li th:class="${open}=='order'?'nav-item menu-open':'nav-item'">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fas ion-gear-a"></i>
                            <p>
                                订单管理
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">


                            <li class="nav-item">
                                <a th:href="@{/admin/page/order}"
                                    th:class="${active}=='order'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>订单列表</p>
                                </a>
                            </li>

                        </ul>
                    </li>
                    <li th:class="${open}=='user'?'nav-item menu-open':'nav-item'">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fas ion-gear-a"></i>
                            <p>
                                用户管理
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">


                            <li class="nav-item">
                                <a th:href="@{/admin/page/user}"
                                    th:class="${active}=='user'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>用户列表</p>
                                </a>
                            </li>

                        </ul>
                    </li>
                    <li th:class="${open}=='agent'?'nav-item menu-open':'nav-item'">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fas ion-gear-a"></i>
                            <p>
                                代理管理
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">


                            <li class="nav-item">
                                <a th:href="@{/admin/page/agent}"
                                    th:class="${active}=='agent'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>代理商列表</p>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a th:href="@{/admin/page/balance}"
                                    th:class="${active}=='balance'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>提现列表</p>
                                </a>
                            </li>
                            <!--                                <li  class="nav-item">-->
                            <!--                                    <a th:href="@{/admin/page/shop}"-->
                            <!--                                       th:class="${active}=='shop'?'nav-link active':'nav-link'">-->
                            <!--                                        <i class="far fa-circle nav-icon"></i>-->
                            <!--                                        <p>商户列表</p>-->
                            <!--                                    </a>-->
                            <!--                                </li>-->

                        </ul>
                    </li>
                    <li th:class="${open}=='setting'?'nav-item menu-open':'nav-item'">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fas ion-gear-a"></i>
                            <p>
                                设置
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">


                            <li class="nav-item">
                                <a th:href="@{/admin/page/gear}"
                                    th:class="${active}=='gear'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>价格设置</p>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a th:href="@{/admin/page/role}"
                                    th:class="${active}=='role'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>分成设置</p>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a th:href="@{/admin/page/logs}"
                                    th:class="${active}=='logs'?'nav-link active':'nav-link'">
                                    <i class="far fa-circle nav-icon"></i>
                                    <p>操作日志</p>
                                </a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </nav>
            <!-- /.sidebar-menu -->
        </div>
        <!-- /.sidebar -->
    </aside>
</div>

</html>